<html>
<head>
<style type="text/css">
html {
    background: white;
    color: black;
}
#test_em {
    border:1em solid;
    border-color:green;
    background-color:red;
}
#test_pt {
    border:1pt solid;
    border-color:green;
    background-color:red;
}
#test_px {
    border:1px solid;
    border-color:pink;
    background-color:green;
}
#test_mm {
    border:1mm solid;
    border-color:red;
    background-color:gray;
}
#test_pc {
    border:1pc solid;
    border-color:yellow;
    background-color:gray;
}
#test_cm {
    border:1cm solid;
    border-color:pink;
    background-color:gray;
}
#test_in {
    border:1in solid;
    border-color:red;
    background-color:gray;
}
</style>
</head>
<body>

<div id="test_em"> Hello, 1em </div>
<div id="test_pt"> Hello, 1pt </div>
<div id="test_px"> Hello, 1px </div>
<div id="test_mm"> Hello, 1mm </div>
<div id="test_pc"> Hello, 1pc </div>
<div id="test_cm"> Hello, 1cm </div>
<div id="test_in"> Hello, 1in </div>

</body>
</html>

